@import "main";
$fontSize:12px;
.main{
  font-size:$fontSize;
}
nav{
  ul{
    margin:0 auto;
    padding:0;
    list-style:none;
  }
  li{
    display:inline-block;
  }
  a{
    color:#fff;
    & :hover{
      color: green;
    }
  }
}
@mixin box-sizing($sizing) {
  -webkit-box-sizing:$sizing;
  -moz-box-sizing:$sizing;
  box-sizing:$sizing;
}
.box-border{
  border:1px solid #eee;
  @include box-sizing(border-box);
}

.message{
  boder: 1px solid #ccc;
  padding: 10px;
  color: #666;
}

.success{
  @extend .message;
  border-color: green;
}
.error{
  @extend .message;
  border-color:red;
}


.parent-1{
   color:#fff;
  .child{
    width:200px;
  }
}

.parent-2{
  color:#666666;
  @at-root .child-2{
    width:200px;
  }
}